$(function () {
var currentPage = 1
var count = 3
let url = "/role/findRoleWithModule"

getRemoteRole(currentPage,count)

// 向网站发送请求,传递一个page参数
function getRemoteRole(page,count) {
    page = +page <= 0 ? 1 : +page;
    count = +count <= 0 ? 3 : + count;

    params ={
        page : page,
        count : count
    }
    $.get(url, params, handlerResponse)

}
// 请求的回调函数,请求回来的数据都在参数 showDetails 中
function handlerResponse(resp) {
    // 请求状态码
    if (resp.status === 200){
        var Quantity = resp.data.totalCount;
        // 获取到请求到的需要铺在页面上的数据
        var items = resp.data.items;
        //  计算一共需要分多少页
        pages = Math.ceil(Quantity / count);
        // 调用画页码的函数,传递需要画多少页的参数 pages
        drawPageIndicator(pages);

        // 调用渲染表格的方法,把请求到的数据的items 当参数传递过去
        putItemsInTable(items);
    }


}


//    上一页链接的点击时间
$('#prev').click(function () {
    --currentPage;
    if (currentPage < 1){
        currentPage = 1
    }
    getRemoteRole(currentPage,count)
})
// 下一页链接的点击事件
$('#next').click(function () {
    ++ currentPage;
    if (currentPage > pages){
        currentPage = 1;
    }
    getRemoteRole(currentPage,count)
})






// 画页码的函数
function drawPageIndicator(pages) {

    var ul = $('#page')
    ul.empty();

    for (var i = 1; i <= pages; i++ ){
        var li = $('<li style="float: left"></li>');
        console.log(li)

        if (currentPage == i){
            li.addClass('current_page');
        }

        var a = $('<a></a>');
        // 给a标签添加属性,这条属性的意思为点击链接后不进行页面上的跳转.
        a.attr('href','javascript:void(0)');
        a.text(i);

        a.click(onIndicatorClick)

        li.append(a);
        ul.append(li);
    }
}

// 当前的页面的点击事件
function onIndicatorClick() {
    currentPage = +$(this).text();

    getRemoteRole(currentPage,count);
}
// 将数据渲染到表格的函数
function putItemsInTable(items) {

    var tbody = $('#body');
    tbody.empty();
    for (var i of items){

        var tr = $('<tr></tr>')
        var roleId = $('<td></td>').text(i.roleId)
        var roleName = $('<td></td>').text(i.roleName)
        var allModule = $('<td></td>').text(i.allModule)

        var td_modi = $('<td class="td_modi"></td>')
        var modi_btn = $('<input type="button" value="修改" class="btn_modify" />')
        var del_btn = $(' <input type="button" value="删除" class="btn_delete" />')
        td_modi.append(modi_btn).append(del_btn);

        tr.append(roleId).append(roleName).append(allModule).append(td_modi)
        tbody.append(tr)
    }



}
// 修改的点击事件
$("body").on("click", "input.btn_modify", function() {
    var roleId = $(this).parents("tr").children().eq(0).html();
    var roleName = $(this).parents("tr").children().eq(1).html();


    // window.location.href='/role/role_modi.html?roleId='+param+''

    window.location.href='/role/role_modi.html'

    window.localStorage.setItem('roleId',roleId)
    window.localStorage.setItem('roleName',roleName)

})


// 删除的点击事件
$("body").on("click", "input.btn_delete", function() {
    var param =  $(this).parents("tr").children().eq(0).html();
    var r = window.confirm("确定删除");
    if (r == true) {
        let url = "/role/delRole";
        var params = {
            roleId:param
        }
        console.log(param)
        $.post(url,params);
        window.location.reload();
    } else {
        console.log('你取消了这次操作')
    }

})

})